<!--
  This file is a part of the open-eBackup project.
  This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0.
  If a copy of the MPL was not distributed with this file, You can obtain one at
  http://mozilla.org/MPL/2.0/.
  
  Copyright (c) [2024] Huawei Technologies Co.,Ltd.
  
  THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
  EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
  MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
  -->

<lv-form [formGroup]="formGroup" class="formGroup">
  <lv-form-item>
    <lv-form-label lvRequired>
      {{'system_sftp_target_storage_unit_label' | i18n}}
    </lv-form-label>
    <lv-form-control [lvErrorTip]="baseUtilService.requiredErrorTip">
      <lv-select [lvOptions]="storageUnitOptions" lvValueKey="value" formControlName="poolId" lvShowFilter lvFilterKey="label"
        lvFilterMode="contains" [lvDisabled]="isModify"></lv-select>
    </lv-form-control>
</lv-form-item>
  <lv-form-item>
    <lv-form-label>
      {{ 'common_ip_address_type_label' | i18n }}
    </lv-form-label>
    <lv-form-control>
      <lv-radio-group formControlName="ipType">
        <lv-group lvGutter="16px">
          <lv-radio [lvValue]="'IPV4'">
            IPV4
          </lv-radio>
          <lv-radio [lvValue]="'IPV6'">
            IPV6
          </lv-radio>
        </lv-group>
      </lv-radio-group>
    </lv-form-control>
  </lv-form-item>
  <lv-form-item>
    <lv-form-label lvRequired>
      {{
        formGroup.value.ipType === 'IPV6'
          ? ('common_ipv6_address_label' | i18n)
          : ('common_ipv4_address_label' | i18n)
      }}
      <i
        lv-icon="aui-icon-help"
        lvTooltipTheme="light"
        lvTooltipPosition="bottom"
        lv-tooltip="{{ 'system_sftp_service_float_ip_desc_label' | i18n }}"
        class="configform-constraint"
        lvColorState="true"
      ></i>
    </lv-form-label>
    <lv-form-control [lvErrorTip]="baseUtilService.ipErrorTip">
      <input
        lv-input
        type="text"
        formControlName="ip"
        placeholder="{{ 'common_plus_enter_label' | i18n }}"
      />
    </lv-form-control>
  </lv-form-item>
  <lv-form-item>
    <lv-form-label lvRequired>
      {{
        formGroup.value.ipType === 'IPV6'
          ? ('common_prefix_length_label' | i18n)
          : ('common_mask_ip_label' | i18n)
      }}
    </lv-form-label>
    <lv-form-control [lvErrorTip]="maskErrorTip">
      <input
        lv-input
        type="text"
        formControlName="mask"
        placeholder="{{
          formGroup.value.ipType === 'IPV6'
            ? '1~128'
            : ('common_plus_enter_label' | i18n)
        }}"
      />
    </lv-form-control>
  </lv-form-item>
  <lv-form-item>
    <lv-form-label>
      {{ 'common_gateway_label' | i18n }}
    </lv-form-label>
    <lv-form-control [lvErrorTip]="baseUtilService.ipErrorTip">
      <input
        lv-input
        type="text"
        formControlName="gateway"
        class="network-input"
      />
    </lv-form-control>
  </lv-form-item>
</lv-form>
<!--  如果接口没有返回port 则需要用户手动选择  -->
<h2 class="aui-gutter-column-md top">
  {{ 'common_config_ports_label' | i18n }}
</h2>
<div class="header">
  <lv-group lvGutter="8px" lvDirection="vertical">
    <lv-checkbox
      [(ngModel)]="enableVlan"
      (ngModelChange)="vlanChange($event)"
      >{{ 'common_vlan_enable_label' | i18n }}</lv-checkbox
    >
    <span class="check-box-span aui-text-desc">{{
      'common_vlan_tip_label' | i18n
    }}</span>
  </lv-group>
</div>
<lv-form [formGroup]="formGroup">
  <lv-form-item>
    <lv-form-label lvRequired>
      {{ 'common_ports_type_label' | i18n }}
    </lv-form-label>
    <lv-form-control>
      <lv-select
        formControlName="homePortType"
        [lvOptions]="homePortTypeOptions"
        lvValueKey="value"
      >
      </lv-select>
    </lv-form-control>
  </lv-form-item>
  <lv-form-item
    *ngIf="
      !(
        formGroup.value.homePortType ===
          dataMap.initHomePortType.ethernet.value && !enableVlan
      )
    "
  >
    <lv-form-label>
      {{ 'common_port_choice_label' | i18n }}
    </lv-form-label>
    <lv-form-control>
      <lv-group lvGutter="8px" lvDirection="vertical" style="margin-top:8px">
        <lv-radio-group formControlName="isReuse">
          <lv-group lvGutter="20px">
            <lv-radio [lvValue]="false">
              {{ 'common_create_new_port_label' | i18n }}
            </lv-radio>
            <lv-radio [lvValue]="true">
              {{ 'common_reuse_port_label' | i18n }}
            </lv-radio>
          </lv-group>
        </lv-radio-group>
      </lv-group>
    </lv-form-control>
  </lv-form-item>
  <div [ngClass]="{ top: !enableVlan }">
    <lv-alert lvType="info" *ngIf="!isX9000">{{ tips }}</lv-alert>
  </div>
  <div class="transfer" *ngIf="!formGroup.value.isReuse">
    <lv-transfer
      [lvTitles]="[
        'system_select_port_label' | i18n,
        'system_selected_port_label' | i18n
      ]"
      [lvSourceColumns]="source.cols"
      [lvSourceData]="source.data"
      [lvSourceSelection]="source.selection"
      [lvTargetColumns]="target.cols"
      lvColDisplayControl="false"
      (lvSelectionChange)="selectionChange($event)"
      [lvItemSize]="10"
      lvDataKey="location"
    ></lv-transfer>
  </div>
  <!-- 复用时使用新的表和变量 -->
  <div class="transfer" *ngIf="formGroup.value.isReuse">
    <lv-transfer
      [lvTitles]="[
        'system_select_port_label' | i18n,
        'system_selected_port_label' | i18n
      ]"
      [lvSourceColumns]="oldSource.cols"
      [lvSourceData]="oldSource.data"
      [lvSourceSelection]="oldSource.selection"
      [lvTargetColumns]="oldTarget.cols"
      lvColDisplayControl="false"
      (lvSelectionChange)="oldSelectionChange($event)"
      [lvItemSize]="10"
      lvDataKey="name"
    ></lv-transfer>
  </div>
  <ng-container *ngIf="enableVlan && !formGroup.value.isReuse">
    <lv-form-item>
      <lv-form-label lvRequired>
        {{ 'VLAN ID' | i18n }}
      </lv-form-label>
      <lv-form-control [lvErrorTip]="vlanErrorTip">
        <input lv-input type="text" formControlName="vlanID" />
      </lv-form-control>
    </lv-form-item>
  </ng-container>
  <lv-group lvGutter="8px" class="aui-gutter-column-sm">
    <h2>{{ 'system_route_config_label' | i18n }}</h2>
    <lv-switch formControlName="enableRoute"></lv-switch>
  </lv-group>
  <aui-route-config
    [isNetwork]="true"
    [ipType]="formGroup.value.ipType"
    (routeStatus)="routeStatusChange($event)"
    [routeData]="routeData"
    [gateway]="formGroup.get('gateway').value"
    *ngIf="formGroup.get('enableRoute').value"
  ></aui-route-config>

  <lv-group lvGutter="8px" style="margin: 20px 0px 10px 0">
    <h2>{{ 'WORM' }}</h2>
    <lv-switch
      formControlName="isWormEnable"
      [lvDisabled]="wormGroup.value.isWormExist"
    ></lv-switch>
  </lv-group>
  <div>
    <i lv-icon="lv-icon-status-info" lvColorState="true" class="type-icon"></i>
    <span style="margin-left:4px" class="text-middle">{{ getWormTip() }}</span>
  </div>
</lv-form>
<ng-container *ngIf="formGroup.value.isWormEnable">
  <div class="worm-container">
    <lv-form [formGroup]="wormGroup">
      <!-- 模式 -->
      <lv-form-item>
        <lv-form-label>{{
          'protection_incremental_mode_label' | i18n
        }}</lv-form-label>
        <lv-form-control>
          <lv-group lvDirection="vertical">
            <lv-select
              [lvOptions]="modeOptions"
              lvValueKey="value"
              formControlName="wormType"
              [lvDisabled]="wormGroup.value.isWormExist"
            ></lv-select>
            <ng-container
              *ngTemplateOutlet="
                tipsTpl;
                context: {
                  tip:
                    wormGroup.value.wormType === 1
                      ? 'common_compliance_mode_rule_tips_label'
                      : 'common_compliance_mode_company_tips_label'
                }
              "
            >
            </ng-container>
          </lv-group>
        </lv-form-control>
      </lv-form-item>
      <!-- 保护期 -->
      <lv-form-item>
        <lv-form-label>
          {{ 'common_protection_period_label' | i18n }}
        </lv-form-label>
        <lv-form-control [lvErrorTip]="protectErrorTip">
          <lv-group lvGutter="6px">
            <input
              lv-input
              class="input-width"
              formControlName="wormDefProtectPeriod"
            />
            <lv-select
              [lvOptions]="protectionDurations"
              class="input-width"
              lvValueKey="value"
              formControlName="defProtectTimeUnit"
              [lvDisabled]="wormGroup.value.isWormExist"
            ></lv-select>
          </lv-group>
        </lv-form-control>
      </lv-form-item>
      <!-- 自动锁定 -->
      <lv-form-item>
        <lv-form-label>
          {{ 'common_auto_lock_label' | i18n }}
        </lv-form-label>
        <lv-form-control>
          <lv-checkbox
            formControlName="isWormAutoLock"
            class="autolock-checkbox"
            [lvDisabled]="wormGroup.value.isWormExist"
          >
            {{ 'common_enable_label' | i18n }}
          </lv-checkbox>
        </lv-form-control>
      </lv-form-item>
      <!-- 锁定等待时长 -->
      <ng-container *ngIf="wormGroup.value.isWormAutoLock">
        <lv-form-item>
          <lv-form-label>
            {{ 'common_lock_wait_time_label' | i18n }}
          </lv-form-label>
          <lv-form-control [lvErrorTip]="stopErrorTip">
            <lv-group lvGutter="6px">
              <input
                lv-input
                class="input-width"
                formControlName="wormAutoLockTime"
              />
              <lv-select
                [lvOptions]="lockWaitDurations"
                lvValueKey="value"
                class="input-width"
                formControlName="autoLockTimeUnit"
                [lvDisabled]="wormGroup.value.isWormExist"
              ></lv-select>
            </lv-group>
            <ng-container
              *ngTemplateOutlet="
                tipsTpl;
                context: { tip: 'common_lock_wait_time_tips_label' }
              "
            ></ng-container>
          </lv-form-control>
        </lv-form-item>
      </ng-container>
      <!-- 自动删除 -->
      <lv-form-item>
        <lv-form-label>
          {{ 'common_auto_delete_label' | i18n }}
        </lv-form-label>
        <lv-form-control>
          <lv-group
            lvDirection="vertical"
            lvGutter="10px"
            style="margin-top:8px"
          >
            <lv-checkbox
              formControlName="isWormAutoDel"
              [lvDisabled]="wormGroup.value.isWormExist"
            >
              {{ 'common_enable_label' | i18n }}
            </lv-checkbox>
            <ng-container
              *ngTemplateOutlet="
                tipsTpl;
                context: { tip: 'common_auto_delete_tips_label' }
              "
            ></ng-container>
          </lv-group>
        </lv-form-control>
      </lv-form-item>
    </lv-form>
  </div>
</ng-container>

<ng-template #tipsTpl let-tip="tip">
  <div>
    <i
      lv-icon="lv-icon-status-info"
      style="margin: 2px"
      lvColorState="true"
    ></i>
    <span class="info-label" innerHTML="{{ tip | i18n }}"> </span>
  </div>
</ng-template>

<ng-template #linkStatusTpl let-item>
  <span lv-overflow>{{
    item.runningStatus | textMap: 'initRuningStatus'
  }}</span>
</ng-template>
